<template>
  <div>
    <!-- 页面头部开始 -->
    <div class="head_bg">
      <div class="tit_bg">
        <div class="contain">
          <div class="tit_l">欢迎访问i厦门统一政务服务平台！</div>
          <div class="tit_r">
            <ul id="sso_user">
              <li><a href="https://www.ixm.gov.cn/ids/custom/xiamen/login_xm.jsp">登录</a></li>
              <li><a href="https://passport.ixm.gov.cn/#/register">注册</a></li>
            </ul>
          </div>
          <div class="clear"></div>
        </div>
      </div>
      <div class="contain">
        <div
          class="head"
          ms-controller="topSearchInput"
        >
          <div class="logo"><img src="https://www.ixm.gov.cn/images/19ixm_logo.png" /></div>
          <div class="bm_con"><span>区窗口<i></i></span></div>
          <div class="ss_con">
            <form
              action="https://www.ixm.gov.cn/fw/search/index.htm"
              onsubmit="return checkSearchWord();"
              autocomplete="off"
            >
              <input
                type="text"
                class="inp"
                id="inp"
                placeholder="请输入关键字"
                name="p"
                ms-duplex="searchData.p"
                ms-focus="inputFocus"
              />
              <input
                type="submit"
                class="btn"
                value=""
              />
            </form>
            <div class="ss_con1">
              <h3>相关应用</h3>
              <ul class="t16">
                <li
                  ms-for="el in data.yyzx.rows"
                  ms-html="el|topInputYyrkRender"
                ></li>
              </ul>
              <h3 class="mar_t10">相关资讯</h3>
              <ul>
                <li
                  ms-for="el in data.zxzx.rows"
                  ms-html="el|topInputZxzxRender"
                ></li>
              </ul>
            </div>
          </div>
          <div
            class="rs_con"
            id="rs_con"
          >热门搜索：
          </div>
          <div class="clear"></div>
        </div>
        <div class="bm_con1">
          <div class="bm_tit">区</div>
          <div class="bm_list tgray1">
            <ul>
              <li><a
                  href="https://www.ixm.gov.cn/qu/sm/"
                  title="思明区"
                >思明区</a></li>
              <li><a
                  href="https://www.ixm.gov.cn/qu/hl/"
                  title="湖里区"
                >湖里区</a></li>
              <li><a
                  href="https://www.ixm.gov.cn/qu/jm/"
                  title="集美区"
                >集美区</a></li>
              <li><a
                  href="https://www.ixm.gov.cn/qu/hc/"
                  title="海沧区"
                >海沧区</a></li>
              <li><a
                  href="https://www.ixm.gov.cn/qu/ta/"
                  title="同安区"
                >同安区</a></li>
              <li><a
                  href="https://www.ixm.gov.cn/qu/xa/"
                  title="翔安区"
                >翔安区</a></li>
            </ul>
            <div class="clear"></div>
          </div>
        </div>
      </div>
      <div class="dh_menu">
        <i class="ss_btn"></i>
        <i class="menu_ico1"></i>
      </div>
      <div class="menu_bg1">
        <div class="contain">
          <ul>
            <li class="on"><a href="https://www.ixm.gov.cn/">网站首页</a></li>
            <li><a href="https://www.ixm.gov.cn/zxzx/">资讯中心</a></li>
            <li><a href="https://www.ixm.gov.cn/lyzt/">领域专题</a></li>
            <li><a href="https://www.ixm.gov.cn/fwdt/">服务大厅</a></li>
            <li><a href="https://www.ixm.gov.cn/qtms/">倾听民声</a></li>
            <li><a href="https://www.ixm.gov.cn/yyzx/">应用中心</a></li>
          </ul>
          <div class="clear"></div>
        </div>
      </div>
    </div>
    <!-- 页面头部结束 -->
    <!-- 页面主体代码开始 -->
    <div
      class="contain"
      style="width: auto;"
    >

      <div style="height: 395px;"><img
          style="width: 100%;height: 100%;"
          src="#"
        /></div>
      <div style="text-align: center;">
        <p class="information-service-title">租赁车辆信息查询，保障承租人安全</p>
        <div style="padding-top:70px;position: relative;z-index: 2;">
          <form
            action="https://www.ixm.gov.cn/fw/search/index.htm"
            onsubmit="return checkSearchWord();"
            autocomplete="off"
          >
            <input
              class="seach-input"
              type="text"
              placeholder="请输入租赁车牌号进行查询"
            >
            <div style="display: inline-block;background: linear-gradient(#1188FF, #4CA8FF);">
              <input
                class="searchBtn"
                type="button"
              >
            </div>
          </form>
          <div class="vehicle-info-wrap">
            <div class="info-title">
              <span>闽DM2423</span>
              <span>待租</span>
            </div>
            <div class="clearfix">
              <div class="vehicle-info clearfix">
                <span class="info-label">所属企业：</span>
                <div class="info-content ellipsis">首汽租车有限企业</div>
              </div>
              <div
                class="vehicle-info clearfix"
                style="padding-left: 203px;"
              >
                <span class="info-label">企业类型：</span>
                <div class="info-content ellipsis">首汽租车有限企业</div>
              </div>
              <div class="vehicle-info clearfix">
                <span class="info-label">燃料种类：</span>
                <div class="info-content ellipsis">首汽租车有限企业</div>
              </div>
              <div
                class="vehicle-info clearfix"
                style="padding-left: 203px;"
              >
                <span class="info-label">设备号：</span>
                <div class="info-content ellipsis">首汽租车有限企业</div>
              </div>
            </div>
          </div>
        </div>

      </div>

    </div>
    <!-- 页面主体代码结束 -->
    <!-- 页面底部开始 -->
    <div class="bot_bg">
      <div class="contain">
        <div class="bot">
          <div class="bot_c">
            <div class="bot_tit"><a href="https://www.ixm.gov.cn/common/about/">关于我们</a>|<a href="https://www.ixm.gov.cn/common/help/">使用帮助</a>|<a href="https://passport.ixm.gov.cn/#/appeal">我要申诉</a>|<a href="https://www.ixm.gov.cn/common/contract/">联系我们</a>|<a href="https://www.ixm.gov.cn/common/law/">法律声明</a>|<a href="https://www.ixm.gov.cn/common/zczy/">注册指引</a></div>
            <p><span>主办：厦门市人民政府</span><span>建设运营：厦门市民数据服务股份有限公司</span><span>技术指导：厦门市信息中心</span></p>
            <p><span> 闽ICP备14010412号-1</span><span>网站标识码：3502000088 </span><span> 服务热线：0592-5051516, 0592-5051180</span></p>
          </div>
          <div class="bot_r"><a
              target="_blank"
              href="http://bszs.conac.cn/sitename?method=show&id=0A375A9E465F019EE053022819AC8248"
            ><img src="https://www.ixm.gov.cn/images/19ixm_dzjg.png" /></a><span
              style="margin-left:20px;"
              id="_span_jiucuo"
            ><a
                href="http://121.43.68.40/exposure/jiucuo.html?site_code=3502000088&url=http%3A%2F%2Fwww.ixm.gov.cn%2F"
                target="_blank"
              ><img
                  style="margin:0;border:0;cursor: pointer;"
                  src="http://121.43.68.40/exposure/images/jiucuo.png?v=3502000088"
                /></a></span></div>
          <div class="clear"></div>
        </div>
      </div>
    </div>
    <div class="pf_con">
      <ul>
        <li><a href="#"><span class="pf_icon1"></span>
            <p>微信版</p>
          </a>
          <div
            class="pf_con1"
            id="wx_con"
          ><img src="https://www.ixm.gov.cn/images/19ixm_ewm.png" />
            <p>微信扫描<br>添加微信公众平台</p>
          </div>
        </li>
        <li><a href="#"><span class="pf_icon2"></span>
            <p>手机版</p>
          </a>
          <div
            class="pf_con1"
            id="sj_con"
          ><img src="https://www.ixm.gov.cn/images/19ixm_ewm.png" />
            <p>微信扫描<br>添加微信公众平台</p>
          </div>
        </li>
        <li id="capacity"><a href="javascript:void(0);"><span class="pf_icon3"></span>
            <p>智能客服</p>
          </a></li>
        <li
          class="top"
          id="top"
        ><img src="https://www.ixm.gov.cn/images/19ixm_top.png" /></li>
      </ul>
    </div>
    <!-- 页面底部结束 -->
  </div>
</template>

<script>

export default {
  name: 'Dashboard',
  created() {

    const jqueryMin = document.createElement('script');
    jqueryMin.type = 'text/javascript';
    jqueryMin.src = 'https://www.ixm.gov.cn/images/jquery.min.js';
    document.head.appendChild(jqueryMin);

  },
  mounted() {

    const superSlide = document.createElement('script');
    superSlide.type = 'text/javascript';
    superSlide.src = 'https://www.ixm.gov.cn/images/jquery.SuperSlide.js';
    document.body.appendChild(superSlide);

    const TouchSlide = document.createElement('script');
    TouchSlide.type = 'text/javascript';
    TouchSlide.src = 'https://www.ixm.gov.cn/images/TouchSlide.source.js';
    document.body.appendChild(TouchSlide);

    const windowJsp = document.createElement('script');
    windowJsp.type = 'text/javascript';
    windowJsp.src = 'https://www.ixm.gov.cn/ids/custom/2019/ixm.portal.login.window.jsp';
    document.body.appendChild(windowJsp);

    const ixmJS = document.createElement('script');
    ixmJS.type = 'text/javascript';
    ixmJS.src = 'https://www.ixm.gov.cn/images/19ixm_js.js';
    document.body.appendChild(ixmJS);

    const json2 = document.createElement('script');
    json2.type = 'text/javascript';
    json2.src = 'https://www.ixm.gov.cn/images/json2.js';
    document.body.appendChild(json2);

    const avalon = document.createElement('script');
    avalon.type = 'text/javascript';
    avalon.src = 'https://www.ixm.gov.cn/images/avalon.js';
    document.body.appendChild(avalon);

    const base64 = document.createElement('script');
    base64.type = 'text/javascript';
    base64.src = 'https://www.ixm.gov.cn/images/base64.js';
    document.body.appendChild(base64);

    setTimeout(function () { 
      const topSearch = document.createElement('script');
    topSearch.type = 'text/javascript';
    topSearch.src = './topSearch.js';
    document.body.appendChild(topSearch);
    }, 1000)
  }

}
</script>

<style>
@import "https://www.ixm.gov.cn/images/19ixm_style.css";
@import "https://www.ixm.gov.cn/images/19ixm_media_style.css";
@import "https://www.ixm.gov.cn/ids/custom/2019/images/ixm_dl_style.css";
@import "https://www.ixm.gov.cn/ids/custom/2019/images/sliding-verify.css";
*,
:after,
:before {
  -webkit-box-sizing: content-box;
  box-sizing: content-box;
}
.clearfix:after {
  content: "\200B";
  display: block;
  height: 0;
  clear: both;
}

.clearfix {
  *zoom: 1;
}

/*溢出显示省略号*/
.ellipsis {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.information-service-title {
  color: #333;
  font-size: 26px;
  margin-top: 70px;
  font-weight: bold;
}

.vehicle-info {
  width: 50%;
  float: left;
  color: #333;
  box-sizing: border-box;
}

.vehicle-info span {
  display: inline-block;
}

.searchBtn {
  width: 160px;
  height: 50px;
  /* background: url(../../assets/search.png) no-repeat center; */
  background-size: 24px;
  border: 0;
  cursor: pointer;
  transition: all 0.3s;
}

.searchBtn:hover {
  opacity: 0.5;
}

.seach-input {
  width: 840px;
  height: 48px;
  line-height: 48px;
  font-size: 18px;
  box-shadow: 0px 2px 10px 0px rgba(4, 0, 0, 0.1);
  border: 1px solid #e0e0e0;
  border-right: 0;
  background-color: #fff;
  border-bottom-left-radius: 5px;
  border-top-left-radius: 5px;
  text-indent: 32px;
}

.info-label {
  text-align: left;
  vertical-align: middle;
  float: left;
  width: 160px;
  font-size: 14px;
  line-height: 40px;
  box-sizing: border-box;
}

.info-content {
  text-align: left;
  margin-left: 160px;
  line-height: 40px;
  position: relative;
  font-size: 14px;
}

.vehicle-info-wrap {
  width: 1002px;
  padding: 0 32px;
  margin: auto;
  box-sizing: border-box;
}

.info-title {
  padding: 36px 0;
  text-align: left;
}

.info-title span:first-child {
  font-size: 18px;
  color: #333;
  font-weight: 400;
}

.info-title span:last-child {
  display: inline-block;
  color: #fea61e;
  border: 1px solid #fea61e;
  border-radius: 3px;
  margin-left: 20px;
  letter-spacing: 5px;
  padding: 5px;
}
</style>
